<style lang="less">
    @import './index.less';

    .mpr {
        margin-right: 4px;
    }
</style>

<template>
    <div class="login">
        <div class="login-con" :class="{'login-reg-form':loginShow==='register'}">
            <Card icon="log-in" :title="showTitle" :bordered="false">
                <div class="form-con">
                    <login-form @on-success-valid="handleSubmit" v-show="loginShow === 'login'"></login-form>
                    <p class="login-tip">选择登录》
                        <a @click="shouLoginOrRegister('student')" class="mpr">学生</a>
                        <a @click="shouLoginOrRegister('teacher')" class="mpr">教师</a>
                        <a @click="shouLoginOrRegister('admin')">管理员</a>
                    </p>
                </div>
            </Card>
        </div>
    </div>
</template>

<script>
import LoginForm from './login-form'
import { mapActions } from 'vuex'

export default {
  name: 'MeLogin',
  components: {
    LoginForm
  },
  data () {
    return {
      loginShow: 'login',
      pwdForm: false,
      showTitle: '欢迎学生登录',
      type: 'student'
    }
  },
  props: {
    bgImg: {
      type: String,
      default: () => {
        return 'https://skv4.oss-cn-hangzhou.aliyuncs.com/school/school-login.png'
      }
    }
  },
  methods: {
    ...mapActions([
      'handleLogin',
      'getMenuHeaderListData'
    ]),
    handleSubmit ({ userName, password }) {
      this.handleLogin({ userName, password }).then(res => {
        if (res.errcode === 0) {
          if (res.data.errcode === 0) {
            // this.$Message.success('登录成功')
            this.getMenuHeaderListData()
            this.$router.push({
              name: this.$config.homeName
            })
          } else {
            this.$Message.error(res.data.errmsg)
          }
        } else {
          if (res.errcode === 1001) {
            this.$Message.success('登录成功')
            this.getMenuHeaderListData()
            console.log(this.$config.homeName, '登录的地址')
            this.$router.push({
              name: this.$config.homeName
            })
          } else {
            this.$Message.error(res.errmsg)
          }
        }
      })
    },
    registerSuccess () {
      this.loginShow = 'login'
    },
    changePwdSuccess () {
      this.loginShow = 'login'
    },
    shouLoginOrRegister (type) {
      this.type = type
      if (type === 'student') {
        this.showTitle = '欢迎学生登录'
      } else if (type === 'teacher') {
        this.showTitle = '欢迎教师登录'
      } else {
        this.showTitle = '欢迎管理员登录'
      }
    }
  }
}
</script>
